html,
body {
	height: 100%;
}

@media screen and (min-width:1300px) {
	section {
		width: 1200px;
	}

	.center-rigth {
		width: 100%;
	}

	.center-rigth ul li a {
		color: black;
	}

	/* 课程外面的大ul */
	.list-show {
		width: 75%;
		height: auto;
		margin-left: 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
	}

	.list-show li a:hover {
		text-decoration: none;
	}

	.list-show li {
		width: 28%;
		height: 350px;
		list-style: none;
		margin-left: 0;
		margin-right: 5%;
		margin-top: 4%;
	}

	#info {
		width: 100%;
		height: 100%;
	}

	.dian {
		color: gray;
	}

	#info img {
		width: 100%;
		height: 50%;
	}

	/*图片下面的文字 1 */
	#info-list {
		width: 100%;
		text-align: center;
		border: 1px solid #E8E8E8;
	}

	#info-list h3 {
		font-weight: bold;
		color: #6E6E6E;
		font-size: 15px;
		margin-top: 5%;
	}

	#info-list p {
		color: #6B6B6B;
		margin-top: 4%;
		margin-bottom: 4%;
	}

	/* 第二个文字 2  */
	#info-list-seciont {
		border-left: 1px solid #E8E8E8;
		border-right: 1px solid #E8E8E8;
		border-bottom: 1px solid #E8E8E8;
		padding: 10px;
		text-align: center;
		color: #6B6B6B;
	}
	.hs {
		margin-top: 8%;
		border-color: #818181;
		width: 80%;
	}
	#info-list-top{
		width: 80%;
		display: flex;
	}
	#info-list-top .size-qh {
		color: red;
		font-weight: bold;
	}
	
	#info-list-top .size-zh {
		color: blue;
		font-weight: bold;
	} 
}




@media screen and (max-width:1299px) {
	section {
		width: 1200px;
	}
	
	.center-rigth {
		width: 100%;
	}
	
	.center-rigth ul li a {
		color: black;
	}
	
	/* 课程外面的大ul */
	.list-show {
		width: 75%;
		height: auto;
		margin-left: 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
	}
	
	.list-show li a:hover {
		text-decoration: none;
	}
	
	.list-show li {
		height: 300px;
		list-style: none;
		margin-left: 0;
		width: 25%;
		margin-right: 5%;
		margin-top: 5%;
	}
	
	#info {
		width: 100%;
		height: 100%;
	}
	
	.dian {
		color: gray;
	}
	
	#info img {
		width: 100%;
		height: 50%;
	}
	
	/*图片下面的文字 1 */
	#info-list {
		width: 100%;
		text-align: center;
		border: 1px solid #E8E8E8;
	}
	
	#info-list h3 {
		font-weight: bold;
		color: #6E6E6E;
		font-size: 13px;
		margin-top: 5%;
	}
	
	#info-list p {
		color: #6B6B6B;
		margin-top: 4%;
		margin-bottom: 4%;
		font-size: 11px;
	}
	
	/* 第二个文字 2  */
	#info-list-seciont {
		border-left: 1px solid #E8E8E8;
		border-right: 1px solid #E8E8E8;
		border-bottom: 1px solid #E8E8E8;
		padding: 10px;
		text-align: center;
		color: #6B6B6B;
		font-size: 12px;
	}
	.hs {
		margin-top: 8%;
		border-color: #818181;
		width: 80%;
	}
	#info-list-top{
		width: 80%;
		display: flex;
		font-size: 12px;
	}
	#info-list-top .size-qh {
		color: red;
		font-weight: bold;
	}
	
	#info-list-top .size-zh {
		color: blue;
		font-weight: bold;
	} 
}
